<template>
  <a-form
    :form="form"
    @submit="newTaskSubmit">
    <a-tabs defaultActiveKey="1" v-model="activeKey">
      <a-tab-pane tab="内容" key="1">
        <a-form-item :label="taskTitle" has-feedback style="width:200px;">
          <a-select v-decorator="[ 'type', { rules: [{ required: true, message: '请选择任务类型!' }] },]" placeholder="请选择">
            <a-select-option v-for="item in typeList" :key="item.type" :value="item.type"> {{ item.name }} </a-select-option>
          </a-select>
          <!--          <a-select v-else v-decorator="[ 'type', { rules: [{ required: true, message: '请选择任务类型!' }] },]" placeholder="请选择">-->
          <!--            <a-select-option v-for="item in typeList" :key="item.type" :value="item.type"> {{ item.name }} </a-select-option>-->
          <!--          </a-select>-->
        </a-form-item>
        <a-form-item label="任务标题名称">
          <a-input v-decorator="['name', { rules: [{ required: true, message: '请输入任务标题名称!' }] }]" placeholder="请输入（最大字数限制10字）" />
        </a-form-item>
        <a-form-item>
          <span slot="label">

            <!--            <span v-if="taskType===1">计数任务描述</span>-->
            <span>任务描述</span>
            <a-tooltip placement="top">
              <template slot="title">
                <span>APP中展示信息</span>
              </template>
              <a-icon type="exclamation" class="tooltip_style" />
            </a-tooltip>
          </span>
          <a-textarea :rows="3" v-decorator="['des', {rules: [{required: true, message: '请输入任务描述!' }]}]" placeholder="请输入任务描述（最大字数限制20字）"> </a-textarea>
        </a-form-item>

        <div v-if="form.getFieldValue('type')===3">

          <div v-for="(item, index) in createFormMSQList" class="createFormMSQ_box" :key="index">
            <a-row :gutter="24">
              <a-col :span="8">
                <a-form-item :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
                  <span slot="label" style="text-align: left;">选项{{ index+1 }}</span>
<!--                  <a-input v-model="item.des" name="item_des" v-decorator="['item_des', {rules: [{required: true, message: '请输入选项名称!' }]}]" placeholder="请输入选项名称" />-->
<!--                  <a-input v-decorator="[`${item.des}`, {rules: [{required: true, message: '请输入选项名称!' }]}]" placeholder="请输入选项名称" />-->
                  <a-input v-model="item.des" placeholder="请输入选项名称" />
                </a-form-item>
              </a-col>
              <a-col :span="8" style="padding-right: 0;">
                <a-form-item label="是否为异常数据" :label-col="{ span: 10 }" :wrapper-col="{ span: 14 }">
                  <a-select v-model="item.type" placeholder="请选择是否为异常数据">
                    <a-select-option value="1"> 是 </a-select-option>
                    <a-select-option value="2"> 否 </a-select-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="8" style=" padding-left: 0;    line-height: 40px;">
                <div class="icon_delete" @click="createFormMSQDelete(index)">
                  <a-icon type="delete" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
                <div class="icon_add" v-if="createFormMSQList.length === index+1" @click="createFormMSQAdd()">
                  <a-icon type="plus-circle" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
              </a-col>
            </a-row>

          </div>
          <div style="width:66%">
            <a-form-item v-if="!createFormMSQList.length" style="width:100%">
              <a-button type="dashed" style="width:100%" @click="createFormMSQAdd()">
                <a-icon type="plus" /> 添加选择项
              </a-button>
            </a-form-item>
          </div>

        </div>

      </a-tab-pane>
      <a-tab-pane tab="时间" key="2" forceRender>
        <a-form-item label="任务计划">
          <a-radio-group v-model="taskPlan">
            <a-radio :value="2">基于受试者开启试验时间</a-radio>
            <a-radio :value="1">定期</a-radio>
          </a-radio-group>
        </a-form-item>

        <a-form-item label="任务频率">
          <a-radio-group v-model="taskFrequency">
            <a-radio :value="1">一次</a-radio>
            <a-radio :value="2">每天</a-radio>
            <a-radio :value="3">每周</a-radio>
            <a-radio :value="4">每月一次</a-radio>
            <a-radio :value="5">自定义</a-radio>
          </a-radio-group>

        </a-form-item>

        <div v-if="taskPlan === 1">
          <div v-if="taskFrequency===1">
            <a-form-item label="开始时间">
              <a-date-picker v-decorator="['startDate', { rules: [{ required: true, message: '请选择开始日期' }] }]" placeholder="请选择开始日期" class="createForm_count_date" />
              <a-time-picker v-decorator="['occurrenceTime', { rules: [{ required: true, message: '请选择开始时间' }] }]" placeholder="请选择开始时间" style="width:200px" />
            </a-form-item>
            <a-form-item label="结束时间">
              <a-date-picker v-decorator="['endDate', { rules: [{ required: true, message: '请选择结束日期' }] }]" placeholder="请选择结束日期" class="createForm_count_date" />
            </a-form-item>
            <a-form-item label="开始时间描述">
              <a-input v-decorator="['taskTimesDes', { rules: [{ required: true, message: '请输入开始时间描述!' }] }]" placeholder="请输入（最大字数限制20字）" />
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===2">
            <a-form-item label="开始日期">
              <a-date-picker v-decorator="['startDate', { rules: [{ required: true, message: '请选择开始日期' }] }]" placeholder="请选择开始日期" class="createForm_count_date" />
            </a-form-item>
            <a-form-item label="开始时间">
              <div v-for="(item, index) in createFormTimeList" :key="index">
                <a-time-picker v-model="item.everydayTime" style="width:200px" />
                &nbsp;&nbsp;描述：
                <a-input v-model="item.everydayDes" placeholder="请输入（最大字数限制20字）" style="width:300px" />
                <div class="icon_delete" v-if="createFormTimeList.length!==1" @click="createFormTimeDelete(index)">
                  <a-icon type="delete" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
                <div class="icon_add" v-if="createFormTimeList.length === index+1" @click="createFormTimeAdd(index)">
                  <a-icon type="plus-circle" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
              </div>
            </a-form-item>
            <a-form-item label="重复任务的次数">
              <a-input style="width: 100px" v-decorator="['repetitionTime', { rules: [{ required: true, message: '请输入重复任务的次数!' }] }]" placeholder="请输入" /> 次数
            </a-form-item>

          </div>
          <div v-else-if="taskFrequency===3">
            <a-form-item label="星期几/日期">
              <a-select style="width: 130px" v-decorator="['dayWeek', { rules: [{ required: true, message: '请选择星期几!' }] }]" placeholder="请选择星期几">
                <a-select-option value="1">星期一</a-select-option>
                <a-select-option value="2">星期二</a-select-option>
                <a-select-option value="3">星期三</a-select-option>
                <a-select-option value="4">星期四</a-select-option>
                <a-select-option value="5">星期五</a-select-option>
                <a-select-option value="6">星期六</a-select-option>
                <a-select-option value="7">星期日</a-select-option>
              </a-select>&nbsp;&nbsp;
              <a-date-picker v-decorator="['startDate', { rules: [{ required: true, message: '请选择开始日期！' }] }]" placeholder="请选择开始日期" style="margin-left:20px;" />
            </a-form-item>
            <a-form-item label="开始时间">
              <a-time-picker v-decorator="['occurrenceTime', { rules: [{ required: true, message: '请选择开始时间！' }] }]" placeholder="请选择开始时间" style="width:200px" />
            </a-form-item>
            <a-form-item label="重复任务的次数">
              <a-input style="width: 100px" v-decorator="['repetitionTime', { rules: [{ required: true, message: '请输入重复任务的次数!' }] }]" placeholder="请输入" /> 次数
            </a-form-item>

            <a-form-item label="开始时间描述">
              <a-input v-decorator="['taskTimesDes', { rules: [{ required: true, message: '请输入开始时间描述!' }] }]" placeholder="请输入（最大字数限制20字）" />
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===4">
            <a-form-item label="选择日期/时间（当月）">
              <span slot="label">
                选择日期/时间（当月）
                <a-tooltip placement="top">
                  <template slot="title">
                    <span>如果所选日期在一个月内不可用，则将使用该月的最后一天</span>
                  </template>
                  <a-icon type="exclamation" class="tooltip_style" />
                </a-tooltip>
              </span> 每月
              <a-select style="width: 120px" v-decorator="['dayMonth', { rules: [{ required: true, message: '请选择日期!' }] }]" placeholder="请选择日期">
                <a-select-option v-for="item in 31" :key="item" :value="item">{{ item }}</a-select-option>
              </a-select>&nbsp;号&nbsp;

              <a-date-picker v-decorator="['startDate', { rules: [{ required: true, message: '请选择开始日期！' }] }]" placeholder="请选择开始日期" style="margin-left:20px;" />
            </a-form-item>
            <a-form-item label="开始时间">
              <a-time-picker v-decorator="['occurrenceTime', { rules: [{ required: true, message: '请选择开始时间！' }] }]" placeholder="请选择开始时间" style="width:200px" />
            </a-form-item>
            <a-form-item label="重复任务的次数">
              <a-input style="width: 100px" v-decorator="['repetitionTime', { rules: [{ required: true, message: '请输入重复任务的次数!' }] }]" placeholder="请输入" /> 次数
            </a-form-item>

            <a-form-item label="开始时间描述">
              <a-input v-decorator="['taskTimesDes', { rules: [{ required: true, message: '请输入开始时间描述!' }] }]" placeholder="请输入（最大字数限制20字）" />
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===5">
            <a-form-item label="请选择时间及描述">
              <div v-for="(item, index) in createFormCustomTimeList" :key="index">
                <a-range-picker v-model="item.customDate" style="width:250px" />&nbsp;&nbsp;
                <a-time-picker v-model="item.customTime" placeholder="请选择开始时间" style="width:150px" />
                &nbsp;&nbsp;描述：
                <a-input v-model="item.customDes" placeholder="请输入（最大字数限制20字）" style="width:250px" />
                <div class="icon_delete" v-if="createFormCustomTimeList.length!==1" @click="createFormCustomTimeDelete(index)">
                  <a-icon type="delete" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
                <div class="icon_add" v-if="createFormCustomTimeList.length === index+1" @click="createFormCustomTimeAdd()">
                  <a-icon type="plus-circle" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
              </div>
            </a-form-item>
          </div>
        </div>
        <div v-else>
          <div v-if="taskFrequency===1">
            <a-form-item label="开始时间">
              <span>基于定期日期: </span>
              <a-input style="width: 100px" v-decorator="['startDays', { rules: [{ required: true, message: '请输入定位天数!' }] }]" placeholder="请输入" /> 开始&nbsp;&nbsp;&nbsp;&nbsp;
              <a-time-picker v-decorator="['occurrenceTime', { rules: [{ required: true, message: '请选择开始时间！' }] }]" placeholder="请选择开始时间" style="width:200px" />
            </a-form-item>
            <a-form-item label="结束时间">
              <span>基于定期日期: </span>
              <a-input style="width: 100px" v-decorator="['endDays', { rules: [{ required: true, message: '请输入定位天数!' }] }]" placeholder="请输入" /> 结束
            </a-form-item>
            <a-form-item label="开始时间描述">
              <a-input v-decorator="['taskTimesDes', { rules: [{ required: true, message: '请输入开始时间描述!' }] }]" placeholder="请输入（最大字数限制20字）" />
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===2">
            <a-form-item label="开始日期">
              <span>基于定期日期: </span>
              <a-input style="width: 100px" v-decorator="['startDays', { rules: [{ required: true, message: '请输入定位天数!' }] }]" placeholder="请输入" /> 开始
            </a-form-item>
            <a-form-item label="开始时间">
              <div v-for="(item, index) in createFormTimeList" :key="index">
                <a-time-picker v-model="item.everydayTime" style="width:200px" />
                &nbsp;&nbsp;描述：
                <a-input v-model="item.everydayDes" placeholder="请输入（最大字数限制20字）" style="width:300px" />
                <div class="icon_delete" v-if="createFormTimeList.length!=='1'" @click="createFormTimeDelete(index)">
                  <a-icon type="delete" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
                <div class="icon_add" v-if="createFormTimeList.length === index+1" @click="createFormTimeAdd(index)">
                  <a-icon type="plus-circle" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                </div>
              </div>
            </a-form-item>
            <a-form-item label="重复任务的次数">
              <a-input style="width: 100px" v-decorator="['repetitionTime', { rules: [{ required: true, message: '请输入重复任务的次数!' }] }]" placeholder="请输入" /> 次数
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===3">
            <a-form-item label="星期几/日期">
              <a-select style="width: 130px" v-decorator="['dayWeek', { rules: [{ required: true, message: '请选择星期几!' }] }]" placeholder="请选择星期几">
                <a-select-option value="1">星期一</a-select-option>
                <a-select-option value="2">星期二</a-select-option>
                <a-select-option value="3">星期三</a-select-option>
                <a-select-option value="4">星期四</a-select-option>
                <a-select-option value="5">星期五</a-select-option>
                <a-select-option value="6">星期六</a-select-option>
                <a-select-option value="7">星期日</a-select-option>
              </a-select>&nbsp;&nbsp;
              <span style=" margin-left:30px;">基于定期日期: </span>
              <a-input style="width: 100px" v-decorator="['startDays', { rules: [{ required: true, message: '请输入定位天数!' }] }]" placeholder="请输入" /> 开始
            </a-form-item>
            <a-form-item label="开始时间">
              <a-time-picker v-decorator="['occurrenceTime', { rules: [{ required: true, message: '请选择开始时间！' }] }]" placeholder="请选择开始时间" style="width:200px" />
            </a-form-item>
            <a-form-item label="重复任务的次数">
              <a-input style="width: 100px" v-decorator="['repetitionTime', { rules: [{ required: true, message: '请输入重复任务的次数!' }] }]" placeholder="请输入" /> 次数
            </a-form-item>
            <a-form-item label="开始时间描述">
              <a-input v-decorator="['taskTimesDes', { rules: [{ required: true, message: '请输入开始时间描述!' }] }]" placeholder="请输入（最大字数限制20字）" />
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===4">
            <a-form-item label="选择日期/时间（当月）">
              <span slot="label">
                选择日期/时间（当月）
                <a-tooltip placement="top">
                  <template slot="title">
                    <span>如果所选日期在一个月内不可用，则将使用该月的最后一天</span>
                  </template>
                  <a-icon type="exclamation" class="tooltip_style" />
                </a-tooltip>
              </span> 每月
              <a-select style="width: 120px" v-decorator="['dayMonth', { rules: [{ required: true, message: '请选择日期!' }] }]" placeholder="请选择日期">
                <a-select-option v-for="item in 31" :value="item" :key="item">{{ item }}</a-select-option>
              </a-select>&nbsp;号&nbsp;
              <span style=" margin-left:30px;">基于定期日期: </span>
              <a-input style="width: 100px" v-decorator="['startDays', { rules: [{ required: true, message: '请输入定位天数!' }] }]" placeholder="请输入" /> 开始
            </a-form-item>
            <a-form-item label="开始时间">
              <a-time-picker v-decorator="['occurrenceTime', { rules: [{ required: true, message: '请选择开始时间！' }] }]" placeholder="请选择开始时间" style="width:200px" />
            </a-form-item>
            <a-form-item label="重复任务的次数">
              <a-input style="width: 100px" v-decorator="['repetitionTime', { rules: [{ required: true, message: '请输入重复任务的次数!' }] }]" placeholder="请输入" /> 次数
            </a-form-item>
            <a-form-item label="开始时间描述">
              <a-input v-decorator="['taskTimesDes', { rules: [{ required: true, message: '请输入开始时间描述!' }] }]" placeholder="请输入（最大字数限制20字）" />
            </a-form-item>
          </div>
          <div v-else-if="taskFrequency===5">
            <a-form-item label="请选择时间及描述">
              <div v-for="(item, index) in createFormCustomTimeList" style=" margin-bottom: 20px;" :key="index">
                <span>基于定期日期: </span>
                <a-input style="width: 150px" v-model="item.startDays" placeholder="请输入" /> &nbsp;&nbsp;开始
                <span style=" margin-left:30px;">时间：</span>
                <a-time-picker v-model="item.customTime" placeholder="请选择开始时间" style="width:250px" /> <br>
                <span>基于定期日期: </span>
                <a-input style="width: 150px" v-model="item.endDays" placeholder="请输入" /> &nbsp;&nbsp;结束
                <span style=" margin-left:30px;">描述：</span>
                <a-input v-model="item.customDes" placeholder="请输入（最大字数限制20字）" style="width:250px" />
                <div style="    display: inline-block;position: relative; top: -20px;">
                  <div class="icon_delete" v-if="createFormCustomTimeList.length!==1" @click="createFormCustomTimeDelete(index)">
                    <a-icon type="delete" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                  </div>
                  <div class="icon_add" v-if="createFormCustomTimeList.length === index+1" @click="createFormCustomTimeAdd()">
                    <a-icon type="plus-circle" :style="{ fontSize: '15px', color: '#FFFFFF',margin:'0 auto' }" />
                  </div>
                </div>
              </div>
            </a-form-item>

          </div>
        </div>

      </a-tab-pane>
    </a-tabs>

    <a-form-item style="text-align: right; width: 100%;">
      <a-button style="margin-right:20px;" @click="onCancelClick"> 取消 </a-button>
      <a-button type="primary" html-type="submit"> 提交 </a-button>
    </a-form-item>
  </a-form>
</template>

<script>
import moment from 'moment'

export default {
  props: {
    taskType: {
      type: Number,
      required: true
    },
    taskData: {
      type: Object,
      required: true
    },
    // eslint-disable-next-line vue/require-prop-types
    taskTitle: {
      type: String,
      required: true
    }
  },
  data () {
    return {
      taskDTOSeach: {},
      ErrorText: '',
      activeKey: '1',
      createFormTimeList: [{
        'everydayTime': '',
        'everydayDes': ''
      }],
      createFormCustomTimeList: [{
        'customDate': '',
        'startDays': '',
        'endDays': '',
        'customTime': '',
        'customDes': ''
      }],
      createFormMSQList: [{
        'des': '',
        'type': '2'
      }],
      typeList: [{
        'name': '计数器',
        'type': 1
      }, // ],
      // typeList: [
      {
        'name': '问答',
        'type': 2
      },
      {
        'name': '选择',
        'type': 3
      }],
      taskFrequency: 1,
      taskPlan: 2,
      form: this.$form.createForm(this),
      createFormMSQDid: 0
    }
  },
  mounted () {
    // debugger
    // const { form: { setFieldsValue } } = this
    // if (this.taskType === 1) {
    //   setFieldsValue({ type: 1 })
    // } else {
    //   setFieldsValue({ type: 2 })
    // }
    this.handleUpdate('')
  },
  methods: {
    onCancelClick () {
      this.$emit('close')
    },
    // 每日任务添加
    createFormTimeAdd () {
      this.createFormTimeList.push({
        'everydayTime': '',
        'everydayDes': ''
      })
    },
    //  每日任务删除
    createFormTimeDelete (v) {
      this.createFormTimeList.splice(v, 1)
    },
    // 自定义添加
    createFormCustomTimeAdd () {
      this.createFormCustomTimeList.push({
        'customDate': '',
        'startDays': '',
        'endDays': '',
        'customTime': '',
        'customDes': ''
      })
    },

    // 自定义删除
    createFormCustomTimeDelete (v) {
      this.createFormCustomTimeList.splice(v, 1)
    },

    // 问卷选项添加
    createFormMSQAdd () {
      this.createFormMSQList.push({
        'des': '',
        'type': '2'
      })
    },
    // 问卷选项 删除
    createFormMSQDelete (v) {
      this.createFormMSQList.splice(v, 1)
    },

    // 问卷选项 删除
    handleUpdate (newValue) {
      this.activeKey = '1'
      // debugger
      const { form: { setFieldsValue } } = this
      setFieldsValue({
        name: newValue.name,
        des: newValue.des,
        type: newValue.type,
        taskPlan: newValue.taskPlan,
        taskFrequency: newValue.taskFrequency
      })
      if (this.taskType === 1 || this.taskType === 3) {
        // this.typeList.slice()
        // this.typeList.splice(1, 2)
        this.typeList = [{
          'name': '计数器',
          'type': 1
        }]
        setFieldsValue({ type: 1 })
      } else {
        this.typeList = [{
          'name': '问答',
          'type': 2
        },
        {
          'name': '选择',
          'type': 3
        }]
        let type = 2
        if (newValue.type) {
          type = newValue.type
        }
        setFieldsValue({ type: type })
      }
      // debugger
      if (!newValue) {
        this.createFormMSQList.length = 0
        this.createFormMSQAdd()
        this.createFormTimeList.length = 0
        this.createFormTimeAdd()
        this.createFormCustomTimeList.length = 0
        this.createFormCustomTimeAdd()
        setFieldsValue({
          occurrenceTime: '',
          taskTimesDes: '',
          startDate: '',
          endDate: '',
          startDays: '',
          endDays: '',
          repetitionTime: '',
          dayWeek: ''
        })

        return
      }
      // debugger
      if (newValue.type === 3) {
        this.createFormMSQList.length = 0
        // this.createFormMSQList.push(newValue.choices)
        for (const key in newValue.choices) {
          if (newValue.choices.hasOwnProperty(key)) {
            const choice = newValue.choices[key]
            if (choice.des) {
              this.createFormMSQList.push(choice)
            }
          }
        }
      }
      // debugger
      if (newValue.taskFrequency === 1) { // 问卷任务频率 —— 一次
        // this.taskDTOSeach.taskTimes = []
        const taskTimesObj = newValue.taskTimes[0]
        // const taskTimesObj = {
        //   'occurrenceTimeArr': [{
        //     'occurrenceTime': values['occurrenceTime'].format('HH:mm:ss'),
        //     'des': values.taskTimesDes
        //   }]
        // }
        setFieldsValue({
          occurrenceTime: moment(taskTimesObj.occurrenceTimeArr[0].occurrenceTime, 'HH:mm:ss'),
          taskTimesDes: taskTimesObj.occurrenceTimeArr[0].des
        })
        if (newValue.taskPlan === 1) {
          setFieldsValue({
            startDate: taskTimesObj.startDate,
            endDate: taskTimesObj.endDate
          })
          // taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
          // taskTimesObj.endDate = values['endDate'].format('YYYY-MM-DD')
        } else {
          setFieldsValue({
            startDays: taskTimesObj.startDays,
            endDays: taskTimesObj.endDays
          })
          // taskTimesObj.startDays = values.startDays
          // taskTimesObj.endDays = values.startDays
        }
        // this.taskDTOSeach.taskTimes.push(taskTimesObj)
        // console.log(this.taskDTOSeach, '提交数据1111')
      } else if (newValue.taskFrequency === 2) { // 问卷任务频率 —— 每天
        setFieldsValue({
          repetitionTime: newValue.repetitionTime
        })
        // this.taskDTOSeach.repetitionTime = values['repetitionTime']
        // this.taskDTOSeach.taskTimes = []
        const taskTimes = newValue.taskTimes
        if (taskTimes.length > 0) {
          this.createFormTimeList.length = 0
          for (const key in taskTimes) {
            if (taskTimes.hasOwnProperty(key)) {
              const taskTimesObj = {
                // 'customDate': [taskTimes[key].startDate, taskTimes[key].endDate],
                // 'startDays': taskTimes[key].startDays,
                // 'endDays': taskTimes[key].endDays,
                'everydayTime': moment(taskTimes[key].occurrenceTimeArr[0].occurrenceTime, 'HH:mm:ss'),
                'everydayDes': taskTimes[key].occurrenceTimeArr[0].des
              }
              this.createFormTimeList.push(taskTimesObj)
              if (newValue.taskPlan === 1) {
                // taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
                setFieldsValue({
                  startDate: taskTimes[key].startDate
                })
              } else {
                // taskTimesObj.startDays = values.startDays
                setFieldsValue({
                  startDays: taskTimes[key].startDays
                })
              }
            }
          }
          // for (const key in this.createFormTimeList) {
          //   const taskTimesObj = {
          //     'occurrenceTimeArr': [{
          //       'occurrenceTime': this.createFormTimeList[key].everydayTime.format('HH:mm:ss'),
          //       'des': this.createFormTimeList[key].everydayDes
          //     }]
          //   }
          //   if (this.taskPlan === 1) {
          //     // taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
          //     setFieldsValue({
          //       startDate: taskTimesObj.startDate
          //     })
          //   } else {
          //     // taskTimesObj.startDays = values.startDays
          //     setFieldsValue({
          //       startDays: taskTimesObj.startDays
          //     })
          //   }
          // this.taskDTOSeach.taskTimes.push(taskTimesObj)
        }
        // console.log(this.taskDTOSeach, '提交数据222')
      } else if (newValue.taskFrequency === 3) { // 问卷任务频率 —— 星期
        const taskTimesObj = newValue.taskTimes[0]
        setFieldsValue({
          repetitionTime: newValue.repetitionTime,
          taskTimesDes: taskTimesObj.occurrenceTimeArr[0].des,
          occurrenceTime: moment(taskTimesObj.occurrenceTimeArr[0].occurrenceTime, 'HH:mm:ss'),
          dayWeek: taskTimesObj.dayWeek
        })
        // this.taskDTOSeach.repetitionTime = values['repetitionTime']
        // this.taskDTOSeach.taskTimes = []
        // const taskTimesObj = {
        //   'occurrenceTimeArr': [{
        //     'occurrenceTime': values['occurrenceTime'].format('HH:mm:ss'),
        //     'des': values.taskTimesDes
        //   }]
        // }
        if (newValue.taskPlan === 1) {
          setFieldsValue({
            startDate: taskTimesObj.startDate
          })
          // taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
        } else {
          setFieldsValue({
            startDays: taskTimesObj.startDays
          })
          // taskTimesObj.startDays = values.startDays
        }
        // taskTimesObj.dayWeek = values['dayWeek']
        // this.taskDTOSeach.taskTimes.push(taskTimesObj)
        // console.log(this.taskDTOSeach, '提交数据333')
      } else if (newValue.taskFrequency === 4) { // 问卷任务频率 —— 月
        const taskTimesObj = newValue.taskTimes[0]
        setFieldsValue({
          repetitionTime: newValue.repetitionTime,
          taskTimesDes: taskTimesObj.occurrenceTimeArr[0].des,
          occurrenceTime: moment(taskTimesObj.occurrenceTimeArr[0].occurrenceTime, 'HH:mm:ss'),
          dayWeek: taskTimesObj.dayWeek
        })
        // this.taskDTOSeach.repetitionTime = values['repetitionTime']
        // this.taskDTOSeach.taskTimes = []
        // const taskTimesObj = {
        //   'occurrenceTimeArr': [{
        //     'occurrenceTime': values['occurrenceTime'].format('HH:mm:ss'),
        //     'des': values.taskTimesDes
        //   }]
        // }

        if (newValue.taskPlan === 1) {
          setFieldsValue({
            startDate: taskTimesObj.startDate
          })
          // taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
        } else {
          // taskTimesObj.startDays = values.startDays
          setFieldsValue({
            startDays: taskTimesObj.startDays
          })
        }
        // taskTimesObj.dayMonth = values['dayMonth']
        // this.taskDTOSeach.taskTimes.push(taskTimesObj)
        // console.log(this.taskDTOSeach, '提交数据444')
      } else if (newValue.taskFrequency === 5) { // 问卷任务频率 —— 自定义
        // this.taskDTOSeach.taskTimes = []
        const taskTimes = newValue.taskTimes
        if (taskTimes.length > 0) {
          this.createFormCustomTimeList.length = 0
          for (const key in taskTimes) {
            if (taskTimes.hasOwnProperty(key)) {
              const taskTimesObj = {
                'customDate': [taskTimes[key].startDate, taskTimes[key].endDate],
                'startDays': taskTimes[key].startDays,
                'endDays': taskTimes[key].endDays,
                'customTime': moment(taskTimes[key].occurrenceTimeArr[0].occurrenceTime, 'HH:mm:ss'),
                'customDes': taskTimes[key].occurrenceTimeArr[0].des
              }
              this.createFormCustomTimeList.push(taskTimesObj)
            }
          }
        }
        // }
        // for (const key in this.createFormCustomTimeList) {
        // const taskTimesObj = {
        //   'occurrenceTimeArr': [{
        //     'occurrenceTime': this.createFormCustomTimeList[key].customTime.format('HH:mm:ss'),
        //     'des': this.createFormCustomTimeList[key].customDes
        //   }]
        // }
        // if (this.taskPlan === 1) {
        //   taskTimesObj.startDate = this.createFormCustomTimeList[key].customDate[0].format('YYYY-MM-DD')
        //   taskTimesObj.endDate = this.createFormCustomTimeList[key].customDate[1].format('YYYY-MM-DD')
        // } else {
        //   taskTimesObj.startDays = this.createFormCustomTimeList[key].startDays
        //   taskTimesObj.endDays = this.createFormCustomTimeList[key].endDays
        // }
        // this.taskDTOSeach.taskTimes.push(taskTimesObj)
        // }

        // console.log(this.taskDTOSeach, '提交数据55')
      }
    },
    // 点击完成按钮
    newTaskSubmit (e) {
      e.preventDefault()
      this.form.validateFields((err, values) => {
        // debugger
        if (!err) {
          this.taskDTOSeach = {
            // 'sort': 1,
            'name': values.name,
            'type': values.type,
            'des': values.des,
            'taskPlan': this.taskPlan,
            'taskFrequency': this.taskFrequency
          }
          // 选择问卷时添加选项数据
          if (values.type === 3) {
            this.taskDTOSeach.choices = []
            this.taskDTOSeach.choices.length = 0
            // this.taskDTOSeach.choices.push(this.createFormMSQList)
            for (const key in this.createFormMSQList) {
              this.createFormMSQList[key].sort=key
              if (this.createFormMSQList.hasOwnProperty(key)) {
                const choice = this.createFormMSQList[key]
                if (choice.des) {
                  this.taskDTOSeach.choices.push(choice)
                } else {
                  this.activeKey = '1'
                  return
                }
              }
            }
          }
          if (this.taskFrequency === 1) { // 问卷任务频率 —— 一次
            this.taskDTOSeach.taskTimes = []
            const taskTimesObj = {
              'occurrenceTimeArr': [{
                'occurrenceTime': values['occurrenceTime'].format('HH:mm:ss'),
                'des': values.taskTimesDes
              }]
            }
            if (this.taskPlan === 1) {
              taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
              taskTimesObj.endDate = values['endDate'].format('YYYY-MM-DD')
            } else {
              taskTimesObj.startDays = values.startDays
              taskTimesObj.endDays = values.endDays
            }
            this.taskDTOSeach.taskTimes.push(taskTimesObj)
          } else if (this.taskFrequency === 2) { // 问卷任务频率 —— 每天
            this.taskDTOSeach.repetitionTime = values['repetitionTime']
            this.taskDTOSeach.taskTimes = []
            for (const key in this.createFormTimeList) {
              if (this.createFormTimeList.hasOwnProperty(key)) {
                const taskTimesObj = {
                  'occurrenceTimeArr': [{
                    'occurrenceTime': this.createFormTimeList[key].everydayTime.format('HH:mm:ss'),
                    'des': this.createFormTimeList[key].everydayDes
                  }]
                }
                if (this.taskPlan === 1) {
                  taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
                } else {
                  taskTimesObj.startDays = values.startDays
                }
                this.taskDTOSeach.taskTimes.push(taskTimesObj)
              }
            }
          } else if (this.taskFrequency === 3) { // 问卷任务频率 —— 星期
            this.taskDTOSeach.repetitionTime = values['repetitionTime']
            this.taskDTOSeach.taskTimes = []
            const taskTimesObj = {
              'occurrenceTimeArr': [{
                'occurrenceTime': values['occurrenceTime'].format('HH:mm:ss'),
                'des': values.taskTimesDes
              }]
            }
            if (this.taskPlan === 1) {
              taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
            } else {
              taskTimesObj.startDays = values.startDays
            }
            taskTimesObj.dayWeek = values['dayWeek']
            this.taskDTOSeach.taskTimes.push(taskTimesObj)
          } else if (this.taskFrequency === 4) { // 问卷任务频率 —— 月
            this.taskDTOSeach.repetitionTime = values['repetitionTime']
            this.taskDTOSeach.taskTimes = []
            const taskTimesObj = {
              'occurrenceTimeArr': [{
                'occurrenceTime': values['occurrenceTime'].format('HH:mm:ss'),
                'des': values.taskTimesDes
              }]
            }

            if (this.taskPlan === 1) {
              taskTimesObj.startDate = values['startDate'].format('YYYY-MM-DD')
            } else {
              taskTimesObj.startDays = values.startDays
            }
            taskTimesObj.dayMonth = values['dayMonth']
            this.taskDTOSeach.taskTimes.push(taskTimesObj)
          } else if (this.taskFrequency === 5) { // 问卷任务频率 —— 自定义
            this.taskDTOSeach.taskTimes = []
            for (const key in this.createFormCustomTimeList) {
              if (this.createFormCustomTimeList.hasOwnProperty(key)) {
                const taskTimesObj = {
                  'occurrenceTimeArr': [{
                    'occurrenceTime': this.createFormCustomTimeList[key].customTime.format('HH:mm:ss'),
                    'des': this.createFormCustomTimeList[key].customDes
                  }]
                }
                if (this.taskPlan === 1) {
                  taskTimesObj.startDate = this.createFormCustomTimeList[key].customDate[0].format('YYYY-MM-DD')
                  taskTimesObj.endDate = this.createFormCustomTimeList[key].customDate[1].format('YYYY-MM-DD')
                } else {
                  taskTimesObj.startDays = this.createFormCustomTimeList[key].startDays
                  taskTimesObj.endDays = this.createFormCustomTimeList[key].endDays
                }
                this.taskDTOSeach.taskTimes.push(taskTimesObj)
              }
            }
          }
          console.log(this.taskDTOSeach,"asgjag添加数据+++——————————")
          this.$emit('newTaskEvent', this.taskDTOSeach)
        } else {
          let block = ''
          if (values.type === 3) {
            for (const key in this.createFormMSQList) {
              if (this.createFormMSQList.hasOwnProperty(key)) {
                if (!this.createFormMSQList[key].des) {
                  block = '1'
                  break
                }
              }
            }
          }

          if (err.name || err.des || block) {
            this.activeKey = '1'
          } else {
            this.activeKey = '2'
          }
        }
      })
    }
  },
  watch: {
    // taskType: {
    //   handler (newValue, oldValue) {
    //     // debugger
    //     const { form: { setFieldsValue } } = this
    //     if (this.taskType === 1) {
    //       setFieldsValue({ type: 1 })
    //     } else {
    //       setFieldsValue({ type: 2 })
    //     }
    //     // this.$refs.table.refresh(true)
    //   },
    //   deep: true
    // },
    taskData: {
      handler (newValue) {
        this.handleUpdate(newValue)
      },
      deep: true
    }
  }
}
</script>
<style>
/*.ant-modal-body {*/
/*  margin: 0px 50px 30px 50px;*/
/*}*/

/*
.createFormMSQ_box .ant-row {
  display: inline-block
} */

.icon_delete {
  cursor: pointer;
  display: inline-block;
  width: 32px;
  height: 32px;
  background: rgba(238, 114, 114, 1);
  box-shadow: 0 2px 4px 0 rgba(255, 215, 215, 1);
  border-radius: 4px;
  text-align: center;
  line-height: 32px;
  margin-left: 20px;
}
.icon_add {
  cursor: pointer;
  display: inline-block;
  width: 32px;
  height: 32px;
  border-radius: 4px;
  text-align: center;
  line-height: 32px;
  background: rgba(86, 206, 209, 1);
  box-shadow: 0 2px 4px 0 rgba(107, 203, 206, 0.68);
  /*border-radius: 4px;*/
  margin-left: 20px;
}

/*.dynamic-delete-button {*/
/*  cursor: pointer;*/
/*  position: relative;*/
/*  top: 4px;*/
/*  font-size: 24px;*/
/*  color: #999;*/
/*  transition: all 0.3s;*/
/*}*/
/*.dynamic-delete-button:hover {*/
/*  color: #777;*/
/*}*/
/*.dynamic-delete-button[disabled] {*/
/*  cursor: not-allowed;*/
/*  opacity: 0.5;*/
/*}*/
/* .ant-form-item-control-wrapper{
  display: inline-block;
} */
</style>
